HTML - etichete uzuale

Pornind de la structura HTML de baza va puteti  imbogati propria pagina  folosind informatii personalizate conform unei temei alese

Formatare font
Intr-un document HTML poti avea caractere:

·        Evidentiate (bold)

 <b>Text evidentiat</b>

·        Inclinate (italic)

  <i>text inclinat</i>

Si combinatii: <b><i>Text evidentiat si inclinat </i></b>

Pentru dimensiunea textului se folosesc tagurile <font size=n> si </font>
<font size=+2>matematica.</font> determina o marire a fontului cu doua unitati
Pentru stabilirea culorii fontului se foloseste tagul:

<font color="culoare">Text</font> Ex: <font color="red">Text avand culoarea rosie</font>

Alte etichete:

<u>text subliniat</u>

text subliniat

<del>text taiat</del>

 

<sup>exponent</sup>

exponent

<sub>indice</sub>

indice

<strong>text ingrosat</strong>

text ingrosat

<big>mare</big>

mare

<small>mic</small>

mic

<font color="red">font rosu</font>

font rosu

<font face="Courier">font Courier</font>

font Courier

<font size="6">font size=6</font>

font size=6

<div align="center">text aliniat pe centru</div>

text aliniat pe centru

<div align="left">text aliniat la stanga</div>

text aliniat la stanga

<div align="right">text aliniat la dreapta</div>

text aliniat la dreapta

Headings
   Pentru titluri HTML ofera sase nivele de headings,numerotate de la 1 la 6 (cea mai mare dimensiune este 1) astfel incat acestea vor fi afisate cu caractere mai mari si eventual intarite (bold). Etichetareaunui titlupe nivelul x foloseste secventa: <H x>...</Hx>, x avand valoride la 1 la 6.


Paragraphs

Inserarea unui paragraf se semnalizeaza folosind eticheta <P>...</P>

<P>Acesta este un scurt exemplu de paragraf!</P>

         Un paragraf poate fi aliniat folosind atributul: ALIGN=LEFT/CENTER/RIGHT (optiunea implicita fiind LEFT):

Ex:

<P align=left>Aliniere stanga</P>

<P align=center>Aliniere centru</P>

<P align=right>Aliniere dreapta</P>
 

<HTML>
<HEAD>
<TITLE>HTML</TITLE>
</HEAD>
<BODY BGCOLOR=BLACK TEXT=WHITE>
<CENTER><H1>Acesta este un heading 1</H1>
<FONT COLOR=RED >Initiere in HTML</FONT>
<BR>Aceasta este prima mea pagina HTML.
<P ALIGN=LEFT>In curand va arata mai bine!</P>
</BODY>
</HTML>

Liste (Lists)

Liste nenumerotate(Unnumbered Lists)

Pentru a crea o lista nenumerotata(folosind marcatori=bullets):

·  incepeti prin inserarea etichetei delista nenumerotata <UL>

·  introduceti fiecare articol explicitdin lista precedat de eticheta de articol de lista <LI> (fara a folosio eticheta de sfarsit de tipul </LI>)

·  marcati sfarsitul listei prin eticheta</UL> Un exemplu de lista nenumerotata:

<UL>
   <LI> mere
   <LI> pere
   <LI> struguri
</UL>

Liste numerotate (Numbered/Ordered Lists)

        Eticheta de lista este <OL> (articolele listei fiind marcate tot prin eticheta<LI>).
      Un exemplu de cod HTML pentru olista numerotata:

<OL>
<LI> alte mere
<LI> alte pere
<LI> alti struguri
</OL>

Liste de definitii(Definition Lists)

   O lista de definitie (marcata prin<DL>) consta in general intr-un termen de definit (codificat prin <DT>,Definition Term) si un enunt al definitiei (codificat prin <DD>, DefinitionDefinition): uzual, un browser web afiseaza definitia pe o noua linie,indentata fata de pozitia termenului definit.

Un exemplu de lista de definitii:

<DL>
<DT> NCSA
<DD> NCSA, the National Center for Supercomputing
Applications, is located on the campus of the
University of Illinois at Urbana-Champaign.
<DT> Cornell Theory Center
<DD> CTC is located on the campus of Cornell
University in Ithaca, New York.
</DL>

Intrerupere de linie(line break)

    Eticheta <BR> forteaza o intreruperede linie (in cazulin care dorim sa obtinem o secventa de linii de dimensiunescurta.



Linii orizontale(Horizontal Rules)

    Eticheta <HR>are ca rezultat afisareaunei linii orizontale de latimea ferestrei browser-uluisi este in general folosita pentru a separa sectiunile importante ale documenului. Poate folosi parametri de control al grosimii (SIZE) si al latimii (procentul de fereastra acoperit) si culoare.

Exemplu:
<HR SIZE=4 WIDTH="50%" COLOR=”green”>